<template>
  <div>
    
    <el-table :data="tableDataFillter" border style="width: 100%" @selection-change="handleSelectionChange">
      <el-table-column
      type="selection"
      width="55">
    </el-table-column>
      <el-table-column prop="name" label="序号" width="60">
          <template slot-scope="scope">{{scope.$index+1}}</template>
        </el-table-column>
      <el-table-column prop="dynamicUser.userNick" label="ID" width="300">
        <template slot-scope="scope">
          <div>
            <div>id: <span>{{scope.row.dynamicUser.userNick}}</span></div>
            <div v-if="scope.row.product">医院： {{scope.row.product.hospitalInfo.name}}</div>
            <div v-if="scope.row.product">商品：{{scope.row.product.title}}</div>
            <div v-if="scope.row.product">金额：{{scope.row.product.price}}</div>
            <div>到店时间： {{timeFun(scope.row.product,1)}}</div>
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="address" label="评价内容">
        <template slot-scope="scope">
          <div >
            <div class="colorOne" style="margin-bottom:5px">
              <span style="padding-right:30px">评分：{{scope.row.totalscore}}</span>
              <span style="padding-right:30px">环境：{{scope.row.ambienceScore }}</span>
              <span style="padding-right:30px">专业：{{scope.row.serviceScore}}</span>
              <span style="padding-right:30px">效果：{{scope.row.effectScore}}</span>
            </div>
            <div>{{scope.row.dynamicContent}}</div>
            <div>
              <img v-for="(item,index)  in scope.row.images" :src="srcFun(item.imageUrl)" :key="index" @click="showImage(srcFun(item.imageUrl))" style="margin-right:5px;width:70px;height:80px"/>
            </div>
            <el-row style="text-align:right">
              <el-col :span="12" style="text-align:left">{{timeFun(scope.row.createtime,2)}}</el-col>
              <el-col :span="4" class="colorOne">转发：{{scope.row.shares}}</el-col>
              <el-col :span="4" class="colorOne">喜欢：{{scope.row.countLike}}</el-col>
              <el-col :span="4" class="colorOne">评论：{{scope.row.countComment}}</el-col>
            </el-row>
          </div>
        </template>
        <!-- <template slot-scope="scope">
          <div>
            <div>{{scope.row.dynamicContent}}</div>
            <div>
              <img v-for="(item,index)  in scope.row.images"  :src="srcFun(item.imageUrl)" :key="index" @click="showImage(srcFun(item.imageUrl))" style="margin-right:5px;width:70px;height:80px"/>
            </div>
            <el-row>
              <el-col :span="12">{{timeFun(scope.row.createtime)}}</el-col>
              <el-col :span="4" class="colorOne">转发：{{scope.row.shares}}</el-col>
              <el-col :span="4" class="colorOne">喜欢：{{scope.row.countLike}}</el-col>
              <el-col :span="4" class="colorOne">评论：{{scope.row.countComment}}</el-col>
            </el-row>
          </div>
        </template> -->
      </el-table-column>      
      <el-table-column prop="status" label="状态" width="80">
        <template slot-scope="scope">
          <span style="color:#333" v-if="scope.row.dynamicStatus == 0" type="info">未审核</span>
          <span style="color:#67c23a" v-if="scope.row.dynamicStatus == 1"  type="success">通过</span>
          <span style="color:#f56c6c" v-if="scope.row.dynamicStatus == 2"  type="danger">删除</span>
          <div style="color:red" v-if="scope.row.orderAt">置顶</div>

        </template>
      </el-table-column>
      <el-table-column label="操作" width="180">
        <template slot-scope="scope">
          <div>
           
            <el-button v-if="!scope.row.orderAt && userRole.DN_201001 && scope.row.dynamicStatus < 2" type="primary" class="addBtn" @click="putStick(scope.row.dynamicId)">置顶</el-button>
            <el-button v-if=" scope.row.orderAt && userRole.DN_201001 && scope.row.dynamicStatus < 2"  class="addBtn" @click="UpputStick(scope.row.dynamicId)">取消置顶</el-button>
            <el-button v-if="scope.row.dynamicStatus == 0 && userRole.DN_201002" type="success" class="addBtn" @click="passStick(scope.row.dynamicId,1)">通过</el-button>
            <el-button v-if="scope.row.dynamicStatus == 1 && userRole.DN_201002"  type="warning" class="addBtn" @click="passStick(scope.row.dynamicId,0)">取消通过</el-button>

            <el-button v-if="scope.row.dynamicStatus !=2 && userRole.DN_201002" class="addBtn" type="danger"  @click="passStick(scope.row.dynamicId,2)"> 删除</el-button>
            <el-button v-if="scope.row.dynamicStatus ==2 && userRole.DN_201002" type="success" class="addBtn" @click="passStick(scope.row.dynamicId,1)">恢复</el-button>

          </div>
        </template>
      </el-table-column>
    </el-table>
    <div class="block">
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage4"
        :page-sizes="[10, 20, 30, 50]"
        :page-size="10"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </div>
    <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
      <span>这是一段信息</span>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
      </span>
    </el-dialog>
    <el-dialog :visible.sync="imgstuts">
      <img width="100%" :src="titleImgurl" alt="">
    </el-dialog>
  </div>
</template>

<script>
  import getTime from '@/Http/getTime'
  import Http from '@/Http/Http'
  export default {
    data() {
      return {
        userRole:JSON.parse(sessionStorage.getItem('userSolt')),
        dialogVisible:false,
        imgstuts:false,
        titleImgurl:'',
        total:0,
        currentPage4: 1,//分野
        page:1,
        pageSize:10,
        tableData:[]
      }
    },
    props:['navStatus'],
    created(){
      this.getlist()
    },
    computed: {
      tableDataFillter() {
        return this.tableData.filter(item => item.dynamicStatus !== 2)
      }
    },
    methods: {
      getlist() {
        
        const obj = {
          "pageNo":this.page,
          "pageSize":this.pageSize
        }
        if( this.navStatus > -1 ){
          obj.status = this.navStatus
        }

        Http.getDynamiclist(obj)
        .then( res => {
          this.tableData = res.data.data.rows;
          this.total = res.data.data.total;
           this.dataArtice = '';
          this.articelStatus = false
        })
        .catch( error => {
          this.$message.error(`请求失败`)
          setTimeout(()=>{
            this.$router.push('/')
          },2000)
        })
      },

       //分页
      handleSizeChange(val) {
        this.pageSize = val;
        this.getlist()
        
      },
      handleCurrentChange(val) {
        this.page = val;
        this.getlist()
        
      },


      timeFun(val,i) {
        if(i==1){
          if(val && val.daodianTime){
            return val.daodianTime
          } else {
            return ''
          }
        }else {
           return getTime(val)
        }
       
       
      },
      srcFun(obj){
        if(obj.indexOf('(null)') > -1){
          const url = obj.replace('(null)','yajiapp.com')
          return url
        };
        if(obj.indexOf('http://') > -1){
          return obj
        } else{
          obj = 'http://odqiuyfsp.bkt.clouddn.com/'+obj
        }
        return obj
      },
      //选择 推荐
      handleSelectionChange(val) {
        this.$emit('checkFun',val)
        // this.checkFun(val)
      },
      checkFun(val) {  //选择方法
        this.$emit('checkFun',val)
      },
      //置顶
      putStick(val) {
       Http.postStickDynamic(val)
       .then( res => {
          if( res.data.code == 200 ){
           this.$message.success('置顶成功')
           this.getlist()
          } else if(res.data.code == -1003) {
            this.$message.error(`请求失败原因：${res.data.message}`)
            setTimeout(()=>{
              this.$router.push('/')
            },2000)
          }
       })
       .catch( res => {
         this.$message.error('服务器请求失败')
       })
      },
      //取消置顶
      UpputStick(val){
        Http.upStickDynamic(val)
       .then( res => {
          if( res.data.code == 200 ){
           this.$message.success('成功取消置顶')
           this.getlist()
          } else if(res.data.code == -1003) {
            this.$message.error(`请求失败原因：${res.data.message}`)
            setTimeout(()=>{
              this.$router.push('/')
            },2000)
          }
       })
       .catch( res => {
         this.$message.error('服务器请求失败')
       })
      },
      //审核
      passStick(val,i) {
        const arr = ['取消成功','审核成功','删除成功','取消成功']
        Http.postEditDynamic(val,i)
        .then( res => {
          if( res.data.code == 200 ){
            this.$message.success(arr[i])
            this.getlist()
          } else if(res.data.code == -1003) {
            this.$message.error(`请求失败原因：${res.data.message}`)
            setTimeout(()=>{
              this.$router.push('/')
            },2000)
          }
        })
        .catch( res => {
          this.$message.error('服务器请求失败')
        })
      },
     
      
      goEdit(){
        this.$router.push('/Home/editor')
      },
      
      chageStatus(val) {
        let txt ='';
        val? txt ='开启' : txt = '关闭';
       
        
        
      },
      handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
      },
      //导出
      exportXlxs() {
      },
       //搜索
      sheachFun(val){
        
      },
      //图片放大
      showImage(row){
        
        this.titleImgurl = row
        this.imgstuts = true
      }
      
    }
  }
</script>